<template lang="html">
  <div id="charts">
    <div id="hp1plan" :style="{width:'100%',height:'100%'}"></div>
  </div>
</template>

<script>
import co from 'co'
import echarts from 'echarts'
import { HttpResetClass } from 'vue-client'
import * as Util from '../../../Util'

let getData = function * (self) {
  let load = new HttpResetClass()
  load.load('POST', 'rs/sql/HandPlan', {data: {condition: self.condition}}, {resolveMsg: null, rejectMsg: null})
  .then((res) => {
    let gasdata = []
    let yint = 0
    let wint = 0
    for (var i = 0; i < res.data.length; i++) {
      yint += res.data[i].y
      wint += res.data[i].w
    }
    gasdata = [
      {name: '已抄表', value: yint},
      {name: '未抄表', value: wint}
    ]
    self.set(gasdata)
  })
}
export default {
  title: 'handplan',
  data () {
    return {
      xc: '',
      condition: '1 = 1'
    }
  },
 methods: {
   set (gasdata) {
     this.xc = echarts.init(document.getElementById('hp1plan'))
     this.xc.setOption({
       title : {
            text: '抄表率饼图',
            subtext: '数据来源',
            left: 'center'
   },
   tooltip : {
       trigger: 'item',
       formatter: "{a} <br/>{b} : {c} ({d}%)"
   },
   legend: {
       orient: 'vertical',
       left: 'left',
       data: ['已抄表','未抄表']
   },
   series : [
       {
           name: '数据访问来源',
           type: 'pie',
           radius : '55%',
           center: ['50%', '60%'],
           data:gasdata,
           itemStyle: {
               emphasis: {
                   shadowBlur: 10,
                   shadowOffsetX: 0,
                   shadowColor: 'rgba(0, 0, 0, 0.5)'
               }
           }
       }
   ]
     })
   },
   searchdata () {
     let getGen = getData(this)
     co(getGen)
   }
 },
 ready () {
   this.condition = `u.f_filiale = '${Util.f.f_fengongsi}'`
   this.searchdata()
 }

}
</script>
<style lang="css">
#charts div{
  height: auto;
}
</style>
